import styles from './index.module.scss'
type Props = {
  type: '' | 'gender' | 'photo'
  onClose: () => void
  onUpdateProfile: (
    type: '' | 'gender' | 'photo',
    value: string | number
  ) => void
}
// 固定数据
// type List = Array<{ text: string; value: string | number }>
const genderList = [
  { text: '男', value: 0 },
  { text: '女', value: 1 },
]

const photoList = [
  { text: '拍照', value: 'picture' },
  { text: '本地选择', value: 'local' },
]
const EditList = ({ onClose, type, onUpdateProfile }: Props) => {
  // const onItemClick = (value: string | number) => {
  //   onUpdateProfile(type, value)
  // }
  // 选项动态渲染
  const list = type === 'gender' ? genderList : photoList
  return (
    <div className={styles.root}>
      {/* <div className="list-item" onClick={() => onItemClick(0)}>
        男
      </div>
      <div className="list-item" onClick={() => onItemClick(1)}>
        女
      </div> */}
      {list.map((item) => (
        <div
          className="list-item"
          key={item.text}
          onClick={() => {
            // if (type === '') return
            onUpdateProfile(type, item.value)
          }}>
          {item.text}
        </div>
      ))}

      <div className="list-item" onClick={onClose}>
        取消
      </div>
    </div>
  )
}

export default EditList
